<template>
  <div>
    <el-table :data="studentList" stripe style="width: 100%">
      <el-table-column prop="sid" label="学号/手机" width="180">
      </el-table-column>
      <el-table-column prop="name" label="姓名"> </el-table-column>
      <el-table-column prop="language" label="语言" width="180">
      </el-table-column>
      <el-table-column prop="grade" label="班级"> </el-table-column>

      <el-table-column prop="achievement" label="成绩">
        <template slot="header" slot-scope="scope">
          <span style="cursor: pointer" @click="getStudentScore"
            >成绩
            <span style="font-size: 10px">点击导出成绩</span>
          </span>
        </template>
      </el-table-column>
      <!-- <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button
            type="primary"
            icon="el-icon-edit"
            @click="edit(scope.row)"
            circle
          ></el-button>
          <el-button type="danger" icon="el-icon-delete" circle></el-button>
        </template>
      </el-table-column> -->
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      student: {},
      studentList: [],
      dialogVisible: {
        title: "",
        flag: false, // 是否为新增
        flagVisible: false,
      },
    };
  },
  created() {
    this.getStudentList();
  },
  methods: {
    async getStudentList() {
      const res = await this.$http.get("/management/ranking");
      console.log(res);
      this.studentList = res.data.data;
    },
    //创建二进制内容并下载
    executeDownload(data, fileName) {
      if (!data) {
        return "";
      }
      // 构建文件【二进制内容】
      const blob = new Blob([data]);
      //非IE下载
      if ("download" in document.createElement("a")) {
        let url = window.URL.createObjectURL(blob);
        let link = document.createElement("a");
        link.style.display = "none";
        link.href = url;
        link.setAttribute("download", fileName);
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
      } else {
        // IE10+下载
        navigator.msSaveBlob(blob, fileName);
      }
    },
    async getStudentScore() {
      // console.log("get");
      // this.$message.info("跳转链接下载");
      // setTimeout(() => {
      //   window.open("/api/management/exportGrade");
      // }, 1500);
      // window.location.href = "https://www.baidu.com/";
      const res = await this.$http({
        url: "/management/exportGrade",
        method: "GET",
        responseType: "blob",
      });
      this.executeDownload(res.data,"成绩表.xlsx")
      console.log(res);
    },
  },
};
</script>

<style>
</style>